<template>
  <MenuLayout>
    <template #content>
      <div>
        <p class="fwbold fs-md mg20">· 服务券配额审核</p>
        <div class="filter-box">
          <el-form :model="filterData" label-suffix=":" size="small">
            <el-row>
              <el-col :span="6">
                <el-form-item label-width="100px" label="企业名称">
                  <el-input v-model="filterData.name" clearable placeholder="请输入企业名称关键字"/>
                </el-form-item>
              </el-col>
              <el-col :span="4" class="tl ml20">
                <el-form-item>
                  <el-button size="small" type="danger">查询</el-button>
                  <el-button size="small" type="danger">导出</el-button>
                </el-form-item>
              </el-col>
            </el-row>

          </el-form>
        </div>
        <div class="card">
          <div class="menu-box">
            <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
              <el-menu-item index="1">全部</el-menu-item>
              <el-menu-item index="2">待审核</el-menu-item>
              <el-menu-item index="3">已上架</el-menu-item>
              <el-menu-item index="4">退回修改</el-menu-item>
              <el-menu-item index="5">审核不通过</el-menu-item>
            </el-menu>
          </div>
          <el-table :data="tableData" style="width: 100%" size="medium" :header-cell-style="{background:'rgb(252, 241, 231)',color:'#606266'}">
            <el-table-column label="企业名称" prop="name"></el-table-column>
            <el-table-column label="企业划型" prop="type"></el-table-column>
            <el-table-column label="配额年份" prop="applyYear"></el-table-column>
            <el-table-column label="补贴额度(元)" prop="bidAmt"></el-table-column>
            <el-table-column label="审核状态">
              <template slot-scope="scope">
                <p v-if="scope.row.state == 0" class="color-orange">待审核</p>
                <p v-else-if="scope.row.state == 1" class="color-green">审核通过</p>
                <p v-else-if="scope.row.state == 2" class="color-red">审核不通过</p>
              </template>
            </el-table-column>
            <el-table-column label="配额时间" prop="applytime"></el-table-column>
            <el-table-column label="审核时间" prop="checktime"></el-table-column>
            <el-table-column label="操作" width="180">
              <template slot-scope="scope">
                <el-button type="text" @click="reviewItem( scope.row)" class="color-blue3" v-if="scope.row.state!== 0">
                  查看
                </el-button>
                <el-button v-if="scope.row.state == 0" type="text" class="color-blue3"
                           :class="scope.row.state !== 0 ? 'ml10' : ''"
                           @click="$router.push('/couponApplyCompanyInfo')">审核
                </el-button>
                <el-button v-else-if="scope.row.state == 1" type="text" class="color-blue3"
                           :class="scope.row.state !== 0 ? 'ml10' : ''"
                           @click="$router.push('/couponApplyCompanyInfo')">修改
                </el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
    </template>
  </MenuLayout>
</template>
<script>
import MenuLayout from '@/components/MenuLayout'

export default {
  data() {
    return {
      activeIndex: '1',
      filterData: {},
      tableData: [
        {
          name: '广西中小企业1',
          type: '一般中小企业',
          applyYear: '2024',
          bidAmt: '0',
          state: 2,
          applytime: '2024-5-10 15:15:21',
          checktime: '2024-5-10 15:16:55'
        },
        {
          name: '广西中小企业1',
          type: '一般中小企业',
          applyYear: '2024',
          bidAmt: '0',
          state: 0,
          applytime: '2024-5-10 15:15:21',
          checktime: '2024-5-10 15:16:55'
        },
        {
          name: '广西中小企业1',
          type: '一般中小企业',
          applyYear: '2024',
          bidAmt: '0',
          state: 0,
          applytime: '2024-5-10 15:15:21',
          checktime: '2024-5-10 15:16:55'
        },
        {
          name: '广西中小企业1',
          type: '一般中小企业',
          applyYear: '2024',
          bidAmt: '5000',
          state: 1,
          applytime: '2024-5-10 15:15:21',
          checktime: '2024-5-10 15:16:55'
        },
      ]
    }
  },
  components: {
    MenuLayout
  },
  created() {
  },
  methods: {
    reviewItem(row) {
      this.$router.push({
        path: 'couponApplyCompanyInfo',
        query: {
          id: row?.id
        }
      })
    },
    handleSelect() {
    }
  }
}
</script>

<style scoped>
/*修改elementiUI菜单底部边框的颜色*/
:deep .el-menu--horizontal > .el-menu-item.is-active {
  border-bottom-color: #D32521;
}

:deep .el-table thead {
  color: #000;
}

.filter-box {
  margin-top: 20px;
}
</style>
